<template>
<div>
   <div class="title">周末去哪儿</div>
   <ul>
       <li class="item border-bottom " v-for="item of list" :key="item.id">
            <div class="img-wrap">
             <img  class="item-img" :src="item.imgUrl">
            </div>
           <div class="item-info">
               <p class="item-name">{{item.title}}</p>
               <p class="item-desc">{{item.desc}}</p>
           </div>
       </li>
   </ul>
</div>
</template>

<script>
export default {
    name:'HomeWeekends',
    props:{
      list:Array
    }
}
</script>
<style lang="stylus" scoped>
@import '~styles/mixins.styl'
.title
 line-height:.8rem
 background-color:#eee
 text-indent:.2rem
.img-wrap
 overflow:hidden
 height:0
 padding-bottom:37.09%
 .item-img
  width:100%
.item-info
 padding:.1rem
 .item-name 
  line-height:0.54rem
  font-size:.32rem
  ellipsis()
 .item-desc
  line-height:.4rem
  color:#ccc
  ellipsis()
</style>